<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta charset="utf-8">
  <title>Blog - Metro Mania</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="author" content="">

  <!-- Stylesheets -->
  <link href="style/bootstrap.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/bootstrap.css" rel="stylesheet">
  <link rel="stylesheet" href="style/font-awesome.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/font-awesome.css">
  <link href="style/prettyPhoto.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/prettyPhoto.css" rel="stylesheet">
  <!-- Parallax slider -->
  <link rel="stylesheet" href="style/slider.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/slider.css">
  <!-- Flexslider -->
  <link rel="stylesheet" href="style/flexslider.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/flexslider.css">

  <link href="style/style.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/style.css" rel="stylesheet">

  <!-- Colors - Orange, Purple, Light Blue (lblue), Red, Green and Blue -->
  <link href="style/lblue.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/lblue.css" rel="stylesheet">

  <link href="style/bootstrap-responsive.css" tppabs="http://responsivewebinc.com/premium/metro/lblue/style/bootstrap-responsive.css" rel="stylesheet">
  
  <!-- HTML5 Support for IE -->
  <!--[if lt IE 9]>
  <script src="js/html5shim.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/html5shim.js"></script>
  <![endif]-->

  <!-- Favicon -->
  <link rel="shortcut icon" href="img/favicon/favicon.png">
</head>

<body>

<!-- Header Starts -->
<header>
  <div class="container">
    <div class="row">
      <div class="span6">
        <div class="logo">
          <h1><a href="#">Metro <span class="color">Mania</span></a></h1>
          <div class="hmeta">Responsive Metro Styled Theme</div>
        </div>
      </div>
      <div class="span6">
        <div class="form">
          <form method="get" id="searchform" action="#" class="form-search">
            <input type="text" value="" name="s" id="s" class="input-medium"/>
            <button type="submit" class="btn">Search</button>
          </form>
        </div>
      </div>
    </div>
  </div>
</header>

<!-- Navigation bar starts -->
          <div class="navbar">
           <div class="navbar-inner">
             <div class="container">
               <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                 <span>Menu</span>
               </a>
               <div class="nav-collapse collapse">
                 <ul class="nav">
                   <li><a href="index.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/index.html">Home #1</a></li>
                   <li><a href="index1.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/index1.html">Home #2</a></li>
                   <!-- Refer Bootstrap navbar doc -->
                   <li class="dropdown">
                      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Pages #1 <b class="caret"></b></a>
                      <ul class="dropdown-menu">
                        <li><a href="landing-page.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/landing-page.html">Landing Page</a></li>
                        <li><a href="pricing.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/pricing.html">Pricing Table</a></li>
                        <li><a href="service-3.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/service-3.html">Service</a></li>
                        <li><a href="support.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/support.html">Support</a></li>
                        <li><a href="sitemap.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/sitemap.html">Sitemap</a></li>
                        <li><a href="timeline.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/timeline.html">Timeline</a></li>
                        <li><a href="404.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/404.html">404</a></li>
                        <li><a href="faq.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/faq.html">FAQ</a></li>
                        <li><a href="register1.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/register1.html">Register</a></li>
                        <li><a href="login1.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/login1.html">Login</a></li>
                      </ul>
                   </li>                   
                   <li class="dropdown">
                      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Pages #2<b class="caret"></b></a>
                      <ul class="dropdown-menu">
                        <li><a href="coming-soon.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/coming-soon.html">Coming Soon</a></li>
                        <li><a href="features-4.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/features-4.html">Features</a></li>
                        <li><a href="statement.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/statement.html">Statement</a></li>
                        <li><a href="tasks.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/tasks.html">Tasks</a></li>
                        <li><a href="resume.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/resume.html">Resume</a></li>
                        <li><a href="projects.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/projects.html">Projects</a></li>
                        <li><a href="make-post.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/make-post.html">Make Post</a></li>
                        <li><a href="events.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/events.html">Events</a></li>
                        <li><a href="error-log.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/error-log.html">Error Log</a></li>
                      </ul>
                   </li>
                   <li><a href="service.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/service.html">Service</a></li>
                   <li><a href="aboutus.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/aboutus.html">About Us</a></li>
                   <li class="dropdown">
                      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Blog <b class="caret"></b></a>
                      <ul class="dropdown-menu">
                        <li><a href="blog-2.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/blog-2.html">Blog #1</a></li>
                        <li><a href="blog-4.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/blog-4.html">Blog #1</a></li>
                        <li><a href="blog-single.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/blog-single.html">Blog Single</a></li>
                      </ul>
                    </li>
                                        
                   <li><a href="portfolio.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/portfolio.html">Portfolio</a></li>
                   <li><a href="contactus.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/contactus.html">Contact</a></li>
                 </ul>
               </div>
              </div>
           </div>
         </div>

<!-- Navigation bar ends -->

<div class="content blog">
  <div class="container">

  <h2>Blog</h2>
  <p class="big grey">Something Goes Here.</p>
  <hr />

  <div class="row">
      <div class="span5">
                           <div class="posts">
                           
                              <!-- Each posts should be enclosed inside "entry" class" -->
                              <!-- Post one -->
                              <div class="entry">
                                 <h2><a href="#">Sed justo scelerisque ut constur scelerisque</a></h2>
                                 
                                 <!-- Meta details -->
                                 <div class="meta">
                                    <i class="icon-calendar"></i> 26-2-2012 <i class="icon-user"></i> Admin <i class="icon-folder-open"></i> <a href="#">General</a> <span class="pull-right"><i class="icon-comment"></i> <a href="#">2 Comments</a></span>
                                 </div>
                                 
                                 <!-- Thumbnail -->
                                 <div class="bthumb">
                                    <a href="#"><img src="img/photos/1.jpg" tppabs="http://responsivewebinc.com/premium/metro/lblue/img/photos/1.jpg" alt="" /></a>
                                 </div>
                                 
                                 <!-- Para -->
                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vulputate eros nec odio egestas in dictum nisi vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse porttitor luctus imperdiet. <a href="#">Praesent ultricies</a> enim ac ipsum aliquet pellentesque. Nullam justo nunc, dignissim at convallis posuere, sodales eu orci. Duis a risus sed dolor placerat semper quis in urna. Nam risus magna, fringilla sit amet blandit viverra, dignissim eget est. Ut <strong>commodo ullamcorper risus nec</strong> mattis. Fusce imperdiet ornare dignissim. Donec aliquet convallis tortor, et placerat quam posuere posuere. Morbi tincidunt posuere turpis eu laoreet. Nulla facilisi. Aenean at massa leo. Vestibulum in varius arcu.</p>

                                 <!-- Read more -->
                                 <div class="button"><a href="#">Read More...</a></div>
                              </div>
                              
                              <!-- Post 2 -->
                              <div class="entry">
                                 <h2><a href="#">Ut commo ullarper risus nec scelerisque mattis</a></h2>
                                 
                                 <!-- Meta details -->
                                 <div class="meta">
                                    <i class="icon-calendar"></i> 26-2-2012 <i class="icon-user"></i> Admin <i class="icon-folder-open"></i> <a href="#">General</a> <span class="pull-right"><i class="icon-comment"></i> <a href="#">2 Comments</a></span>
                                 </div>
                                 
                                 <!-- Thumbnail -->
                                 <div class="bthumb">
                                    <a href="#"><img src="img/photos/2.jpg" tppabs="http://responsivewebinc.com/premium/metro/lblue/img/photos/2.jpg" alt="" /></a>
                                 </div>
                                 
                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vulputate eros nec odio egestas in dictum nisi vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse porttitor luctus imperdiet. <a href="#">Praesent ultricies</a> enim ac ipsum aliquet pellentesque. Nullam justo nunc, dignissim at convallis posuere, sodales eu orci. Duis a risus sed dolor placerat semper quis in urna. Nam risus magna, fringilla sit amet blandit viverra, dignissim eget est. Ut <strong>commodo ullamcorper risus nec</strong> mattis. Fusce imperdiet ornare dignissim. Donec aliquet convallis tortor, et placerat quam posuere posuere. Morbi tincidunt posuere turpis eu laoreet. Nulla facilisi. Aenean at massa leo. Vestibulum in varius arcu.</p>
                                 <div class="button"><a href="#">Read More...</a></div>
                              </div>
                              
                              <!-- Pagination -->
                              <div class="paging">
                                 <span class='current'>1</span>
                                 <a href='#'>2</a>
                                 <span class="dots">&hellip;</span>
                                 <a href='#'>6</a>
                                 <a href="#">Next</a>
                              </div> 
                              
                              <div class="clearfix"></div>
                              
                           </div>
                        </div>                        
                        <div class="span4">

                            <!-- Sidebar 1 -->

                           <div class="sidebar">
                              <!-- Widget -->
                              <div class="widget">
                                 <h4>Search</h4>
                                 <form method="get" id="searchform" action="#" class="form-search">
                                    <input type="text" value="" name="s" id="s" class="input-medium"/>
                                    <button type="submit" class="btn">Search</button>
                                 </form>
                              </div>
                              <div class="widget">
                                 <h4>Recent Posts</h4>
                                 <ul>
                                 <li>Etiam adipiscing posuere justo, nec iaculis justo dictum non</li>
                                 <li>Cras tincidunt mi non arcu hendrerit eleifend</li>
                                 <li>Aenean ullamcorper justo tincidunt justo aliquet et lobortis diam faucibus</li>
                                 <li>Maecenas hendrerit neque id ante dictum mattis</li>
                                 <li>Vivamus non neque lacus, et cursus tortor</li>
                                 </ul>
                              </div>
                              <div class="widget">
                                 <h4>About</h4>
                                 <p>Nulla facilisi. Sed justo dui, id erat. Morbi auctor adipiscing tempor. Phasellus condimentum rutrum aliquet. Quisque eu consectetur erat. Proin rutrum, erat eget posuere semper, <em>arcu mauris posuere tortor</em>,velit at <a href="#">magna sollicitudin cursus</a> ac ultrices magna. Aliquam consequat, purus vitae auctor ullamcorper, sem velit convallis quam, a pharetra justo nunc et mauris. </p>
                              </div>                              
                           </div>                                                
                        </div>

                        <div class="span3">

                          <!-- Sidebar 2 -->
                           <div class="sidebar">
                              <div class="widget">
                                 <h4>Recent Posts</h4>
                                 <ul>
                                    <li><a href="#">Condimentum</a></li>
                                    <li><a href="#">Etiam at</a></li>
                                    <li><a href="#">Fusce vel</a></li>
                                    <li><a href="#">Vivamus</a></li>
                                    <li><a href="#">Pellentesque</a></li>

                                 </ul>
                              </div>
                              <div class="widget">
                                 <h4>Contact</h4>
                                 <p>Nulla facilisi. Sed justo dui, id erat. Morbi auctor adipiscing tempor. Phasellus condimentum rutrum aliquet. Quisque eu consectetur erat.  </p>
                              </div>                              
                           </div>                                                
                        </div>
    </div>

 <div class="border"></div>

<!-- Product & links starts -->

<div class="prod">
    <div class="row">
      <div class="span4">
        <div class="home-links">
          <div class="col-l">
            <h5>Downloads</h5>
            <ul>
              <li><a href="#">Linux 8</a></li>
              <li><a href="#">PlayStation</a></li>
              <li><a href="#">GTalk</a></li>
              <li><a href="#">Google Search</a></li>
              <li><a href="#">Linux Phone</a></li>
            </ul>
          </div>
          <div class="col-r">
            <h5>Support</h5>
            <ul>
              <li><a href="#">Linux Update</a></li>
              <li><a href="#">PlayStation</a></li>
              <li><a href="#">GTalk</a></li>
              <li><a href="#">Google Search</a></li>
              <li><a href="#">Linux Phone</a></li>
            </ul>
          </div>
          <div class="clearfix"></div>
        </div>
      </div>
      <div class="span8"> 
        <div class="home-product">
          <div class="home-prod-img" id="s1">
              <img src="img/photos/s1.jpg" tppabs="http://responsivewebinc.com/premium/metro/lblue/img/photos/s1.jpg" />
              <img src="img/photos/s2.jpg" tppabs="http://responsivewebinc.com/premium/metro/lblue/img/photos/s2.jpg" />
              <img src="img/photos/s3.jpg" tppabs="http://responsivewebinc.com/premium/metro/lblue/img/photos/s3.jpg" />
          </div>
          <h3>Canonical Linux 8</h3>
          <p>Aliquam ut feugiat ante. Curabitur justo aliquam. Maecenas turpis urna, eleifend et venenatis eget, ultricies quis urna. Aliquam ut feugiat ante. Curabitur justo aliquam. Aliquam ut feugiat ante. Curabitur justo aliquam. </p>
          <div class="clearfix"></div>
        </div>
      </div>
    </div>
  </div>

<!-- Product & links ends --> 

  </div>
</div>

<!-- Social -->

<div class="social-links">
  <div class="container">
    <div class="row">
      <div class="span12">
        <p class="big"><span>Follow Us On</span> <a href="#"><i class="icon-facebook"></i>Facebook</a> <a href="#"><i class="icon-twitter"></i>Twitter</a> <a href="#"><i class="icon-google-plus"></i>Google Plus</a> <a href="#"><i class="icon-linkedin"></i>LinkedIn</a></p>
      </div>
    </div>    
  </div>
</div>


<!-- Footer -->
<footer>
  <div class="container">
    <div class="row">

      <div class="widgets">
        <div class="span4">
          <div class="fwidget">

            <div class="col-l">
              <h6>Downlaods</h6>
              <ul>
                <li><a href="#">Condimentum</a></li>
                <li><a href="#">Etiam at</a></li>
                <li><a href="#">Fusce vel</a></li>
                <li><a href="#">Vivamus</a></li>
                <li><a href="#">Pellentesque</a></li>
              </ul>
            </div>

            <div class="col-r">
              <h6>Support</h6>
              <ul>
                <li><a href="#">Condimentum</a></li>
                <li><a href="#">Etiam at</a></li>
                <li><a href="#">Fusce vel</a></li>
                <li><a href="#">Vivamus</a></li>
                <li><a href="#">Pellentesque</a></li>
              </ul>
            </div>

          </div>
        </div>

        <div class="span4">
          <div class="fwidget">
            <h6>Categories</h6>
            <ul>
              <li><a href="#">Condimentum - Condimentum gravida</a></li>
              <li><a href="#">Etiam at - Condimentum gravida</a></li>
              <li><a href="#">Fusce vel - Condimentum gravida</a></li>
              <li><a href="#">Vivamus - Condimentum gravida</a></li>
              <li><a href="#">Pellentesque - Condimentum gravida</a></li>
            </ul>
          </div>
        </div>

        <div class="span4">
          <div class="fwidget">
            <h6>Recent Posts</h6>
            <ul>
              <li><a href="#">Sed eu leo orci, condimentum gravida metus</a></li>
              <li><a href="#">Etiam at nulla ipsum, in rhoncus purus</a></li>
              <li><a href="#">Fusce vel magna faucibus felis dapibus facilisis</a></li>
              <li><a href="#">Vivamus scelerisque dui in massa</a></li>
              <li><a href="#">Pellentesque eget adipiscing dui semper</a></li>
            </ul>
          </div>
        </div>
      </div>

      <div class="span12">
          <div class="copy">
            <h6>Metro <span class="color">Mania</span></h6>
            <p>Copyright &copy; <a href="#">Your Site</a> - <a href="index.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/index.html">Home</a> | <a href="aboutus.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/aboutus.html">About Us</a> | <a href="faq.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/faq.html">FAQ</a> | <a href="contactus.html" tppabs="http://responsivewebinc.com/premium/metro/lblue/contactus.html">Contact Us</a></p>
          </div>
      </div>
    </div>
  <div class="clearfix"></div>
  </div>
</footer> 

<!-- JS -->
<script src="js/jquery.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/jquery.js"></script>
<script src="js/bootstrap.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/bootstrap.js"></script> 
<script src="js/jquery.isotope.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/jquery.isotope.js"></script> <!-- Isotope for gallery -->
<script src="js/jquery.prettyPhoto.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/jquery.prettyPhoto.js"></script> <!-- prettyPhoto for images -->
<script src="js/jquery.cslider.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/jquery.cslider.js"></script> <!-- Parallax slider -->
<script src="js/modernizr.custom.28468.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/modernizr.custom.28468.js"></script>
<script src="js/filter.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/filter.js"></script> <!-- Filter for support page -->
<script src="js/cycle.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/cycle.js"></script> <!-- Cycle slider -->
<script src="js/jquery.flexslider-min.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/jquery.flexslider-min.js"></script> <!-- Flex slider -->

<script src="js/easing.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/easing.js"></script> <!-- Easing -->
<script src="js/custom.js" tppabs="http://responsivewebinc.com/premium/metro/lblue/js/custom.js"></script>
</body>
</html>